<template>
    <div id="botton-wrapper">
        <div class="test-wrapper">
            <div class="title">
                AI FORCE
            </div>
            <div class="item-list">
                <span>隐私政策</span>
                <span>使用条款</span>
                <span>关于我们</span>
                <span>用户协议</span>
                <span>帮助中心</span>
                <span>侵权申诉</span>
            </div>
        </div>
        <div class="pattern-wrapper">
            <div class="left-info">
                © 2021 AI FORCE All rights reserved
            </div>
            <div class="pattern-list">
                <img src="../assets/images/QQ.png" alt="QQ">
                <img src="../assets/images/weChat.png" alt="weChat">
                <img src="../assets/images/Vector.png" alt="Vector">
                <img src="../assets/images/Path.png" alt="path">
            </div>
        </div>
    </div>
</template>
<script>
export default {
    name:"bottom",
}

</script>
<style>
#botton-wrapper{
    background-color: #0b0d17;
    height: 256px;
    color: white;
    font-size: 14px;
}
.test-wrapper{
    width: 80%;
    height: 70%;
    margin: auto;
    border-bottom: 2px solid #5a5a5a;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.title{
    margin-bottom: 5%;
}
.item-list{
    color: #ccc;
    font-size: 13px;
    width: 500px;
    display: flex;
    justify-content: space-around
}
.pattern-wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 86%;
    height: 30%;
    padding-left: 7%;
    padding-right: 7%;
}
.pattern-list img{
    margin-right: 25px;
}
</style>